<!DOCTYPE html>
<html lang="ch-ZN">

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta content="telephone=no,email=no" name="format-detection">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>高端定制</title>
    <link rel="stylesheet" href="../../lib/css/reset.min.css">
    <link rel="stylesheet" href="../../lib/css/swiper.min.css">
    <link rel="stylesheet" href="../../lib/css/animate.min.css">
    <link rel="stylesheet" href="../../css/all.min.css">
    <script src="../../lib/js/flexible.js"></script>
    <script src="../../lib/js/fastclick.js"></script>
</head>

<body ontouchstart>

    <div class="app-wrap bg-gary" id="dingzhi" v-cloak>
        <!-- 地址选择 -->
        <div class="dz-address">
            <p class="hd bg-gary p-48">填写收货地址，方便我们为您邮寄面料样品</p>
            <div class="bd-wrap">
                <div class="bd icon-dz-arr-r m-48">
                    <p class="top"><span>{{addInfo.userName}}</span><span class="pl-45">{{addInfo.cellPhone}}</span></p>
                    <p class="bot"><i class="icon-address"></i><span class="pl-30">{{addInfo.address}}</span></p>
                </div>
            </div>
        </div>
        <!-- 定制需求 -->
        <div class="dz-require mt-30 bg-white p-48">
            <!-- 基本信息 -->
            <div class="base-info">
                <h1 class="title">定制需求</h1>
                <div class="input-cell">
                    <input type="text" placeholder="请填写您的性别">
                </div>
                <div class="input-cell">
                    <input type="text" placeholder="请填写您的年龄">
                </div>
            </div>
            <!-- 定制类型 -->
            <div class="dz-type pb-48">
                <h1 class="title">定制类型</h1>
                <div class="selType">
                    <div class="item" v-for="(item,index) in dzParams" :key="index" @click="sel(index)">
                        <input type="radio" name="selType">
                        <span>{{item.type}}</span>
                    </div>
                </div>
                <h2 class="sub-title">面料</h2>
                <div class="selType">
                    <div class="item" v-for="(item,index) in dzParams[selIndex].fabricGroupParams" :key="index" @click="secondSel(index)">
                        <input type="radio" name="mlType">
                        <span>{{item.type}}</span>
                        <b v-if="item.tag">{{item.tag}}</b>
                    </div>
                </div>
                <!-- 图片list -->
                <div class="imgSel">
                    <div class="item" v-for="imgitem in dzParams[selIndex].fabricGroupParams[secondIndex].imgList">
                        <img :src="imgitem.imgUrl" alt="">
                        <input type="checkbox">
                        <span>{{imgitem.description}}</span>
                        <b class="circle"></b>
                    </div>
                </div>
            </div>

            <!-- 技术要求 -->
            <div class="dz-tecRequire pb-48">
                <h1 class="title">技术要求</h1>
                <h2 class="sub-title">领型</h2>
                <div class="selType">
                    <div class="item" v-for="(item,index) in dzParams[selIndex].lingx" :key="index">
                        <input type="radio" name="tecType">
                        <span>{{item.type}}</span>
                    </div>
                </div>
                <h2 class="sub-title">下摆形状</h2>
                <div class="selType">
                    <div class="item" v-for="(item,index) in dzParams[selIndex].xiab" :key="index">
                        <input type="radio" name="xiabType">
                        <span>{{item.type}}</span>
                    </div>
                </div>
            </div>

            <!-- 体型和数据 -->
            <div class="dz-data">
                <h1 class="title">体型和数据</h1>
                <h2 class="sub-title">体型</h2>
                <div class="selType">
                    <div class="item" v-for="(item,index) in dzParams[selIndex].bodyType" :key="index">
                        <input type="radio" name="bodyType">
                        <span>{{item.type}}</span>
                    </div>
                </div>
                <h2 class="sub-title">定制需求</h2>
                <div class="form-input">
                    <div class="input-cell" v-for="(item,index) in dzParams[selIndex].dzRequire" :key="index">
                        <input type="text" :placeholder="item.name">
                        <span class="unit">{{item.unit}}</span>
                    </div>
                </div>
            </div>
            <!-- 其他需求 -->
            <div class="dz-other pb-48">
                <h1 class="title">其他需求</h1>
                <div class="textarea">
                    <textarea placeholder="请在此填写其他需求"></textarea>
                </div>
            </div>
            <!-- 定制数量 -->
            <div class="dz-count">
                <h1 class="title">定制数量</h1>
                <counter></counter>
            </div>
        </div>
        <!-- 提交按钮 -->
        <div class="dz-submit" @click="submit">
            <h1>提交</h1>
        </div>
    </div>
    <script src="../../lib/js/vue.js"></script>
    <script src="../../lib/js/axios.min.js"></script>
    <script src="../../lib/js/swiper.min.js"></script>
    <!-- mock 数据 打包发布的时候记得移除 -->
    <script src="../../lib/js/mock.js"></script>
    <script src="../../js/all.min.js"></script>
    <script>
        dingzhi();
    </script>
</body>

</html>